<template>
  <div class="box">
    <el-form class="head-form" :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch"  @submit.native.prevent>
      <el-form-item>
        <el-form-item label="菜单名称" prop="menuName">
          <el-input
            v-model.trim="queryParams.menuName"
            placeholder="请输入菜单名称"
            clearable
            size="small"
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item>
          <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        </el-form-item>
      </el-form-item>
    </el-form>
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5" v-for="(val,i) of permiList" :key="i">
        <el-button
          type="primary"
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          v-if="val.funcCode == 'Add'"
        >{{ val.funcName }}</el-button>
        <el-button
          type="info"
          icon="el-icon-upload2"
          size="mini"
          @click="handleImport"
          v-if="val.funcCode == 'ImportExcel'"
        >{{ val.funcName }}</el-button>
        <el-button
          type="warning"
          icon="el-icon-download"
          size="mini"
          @click="handleExport"
          v-if="val.funcCode == 'ExprotExcel'"
        >{{ val.funcName }}</el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>
    <el-table
      v-loading="loading"
      :data="menuList"
      border
      default-expand-all
      row-key="menuCode"
      :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
    >
      <el-table-column :resizable="false" prop="meta.title" label="菜单名称" :show-overflow-tooltip="true" width="200"></el-table-column>
      <el-table-column :resizable="false" prop="meta.icon" label="图标" align="center" width="100">
        <template slot-scope="scope">
          <svg-icon :icon-class="scope.row.meta.icon ? scope.row.meta.icon : ''" />
        </template>
      </el-table-column>
      <el-table-column :resizable="false" prop="orderNum" label="排序" width="60"  align="center"></el-table-column>
      <el-table-column :resizable="false" prop="component" label="组件路径" :show-overflow-tooltip="true"></el-table-column>
      <el-table-column :resizable="false" prop="status" label="状态" :formatter="statusFormat" width="80"  align="center">
        <template slot-scope="scope">
          {{scope.row.status==1 ? '正常' : '禁用'}}
        </template>
      </el-table-column>
      <el-table-column :resizable="false" label="创建时间" align="center" prop="addTime"></el-table-column>
      <el-table-column :resizable="false" label="操作" align="center" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <div class="deal-column" v-for="(val,i) of permiList" :key="i">
            <el-button
              type="text"
              icon="el-icon-view"
              size="mini"
              @click="handleDeal(scope.row,val)"
              v-if="val.funcCode == 'View' && scope.row.parentCode != '-1'"
            >{{ val.funcName }}</el-button>
            <el-button
              size="mini"
              type="text"
              icon="el-icon-edit"
              @click="handleDeal(scope.row,val)"
              v-if="val.funcCode == 'Edit' && scope.row.parentCode != '-1'"
            >{{ val.funcName }}</el-button>
            <el-button
              size="mini"
              type="text"
              icon="el-icon-delete"
              @click="handleDeal(scope.row,val)"
              v-if="val.funcCode == 'Delete' && scope.row.parentCode != '-1'"
            >{{ val.funcName }}</el-button>
            <el-button
              size="mini"
              type="text"
              icon="el-icon-plus"
              @click="handleDeal(scope.row,val)"
              v-if="scope.row.leaf == 0 && val.funcCode == 'Add'"
            >{{ val.funcName }}</el-button>
          </div>
            <el-button 
              size="mini"
              type="text"
              icon="el-icon-plus"
              v-if="scope.row.component !== 'Layout' && scope.row.component !== 'ParentView'"
              @click="openAuth(scope.row, 'Add')">
              添加权限
            </el-button>
            <el-button 
              size="mini"
              type="text"
              icon="el-icon-edit"
              v-if="scope.row.component !== 'Layout' && scope.row.component !== 'ParentView'"
              @click="openEditAuthDialog(scope.row)">
              修改权限
            </el-button>
            <!-- @click="openAuth(scope.row, 'Edit')"> -->
        </template>
      </el-table-column>
    </el-table>
    <!-- 添加权限对话框 -->
    <el-dialog :title="dialogTitle" :visible="dialogAuth" width="26%" @close="cancel">
      <el-checkbox-group v-model.trim="checkList" v-if="isEdit">
        <div v-for="item in auth" :key="item.index" class="checkbox-span">
          <el-checkbox :label="item.funcName" v-if="item.funcName != '授权'"></el-checkbox>
        </div>
      </el-checkbox-group>
      <el-form v-model.trim="authForm" v-else>
        <el-form-item label="权限名称" label-width="120px">
          <el-input v-model.trim="authForm.funcName" clearable size="small" placeholder="请输入按钮名称"></el-input>
        </el-form-item>
        <el-form-item label="权限代码" label-width="120px">
          <el-input v-model.trim="authForm.funcCode" clearable size="small" placeholder="请输入按钮代码"></el-input>
        </el-form-item>
        <el-form-item label="权限颜色" label-width="120px">
          <el-select v-model.trim="authForm.colour" clearable size="small">
            <el-option v-for="item in colors" :key="item.index"
            :value="item.value" :label="item.label">
              <span style="float: left;">{{item.label}}</span>
              <span style="float: right; color: #8492a6; font-size: 13px;">{{item.value}}</span>
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="权限图标" label-width="120px">
          <el-input v-model.trim="authForm.icon" clearable size="small"
          placeholder="参考element-ui icon文档"></el-input>
        </el-form-item>
        <el-form-item label="效果预览" label-width="120px">
          <el-button :icon="authForm.icon" :type="authForm.colour" v-if="authForm.funcName !== ''" size="mini">{{authForm.funcName}}</el-button>
        </el-form-item>
      </el-form>

      <div slot="footer" class="dialog-footer" v-show="dealType != 'View'">
        <el-button type="primary" @click="addAuth">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
    <!-- 添加或修改菜单对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="700px" append-to-body :close-on-click-modal="false">
      <el-form ref="form" :model="form" :rules="rules" label-width="80px" :disabled="dealType=='View'">
        <el-row>
          <el-col :span="24">
            <el-form-item>
              <span slot="label"><span style="color:#ff4949">*</span> 上级菜单</span>
              <treeselect
                v-model.trim="menuId"
                :options="menuOptions"
                :normalizer="normalizer"
                :disabled=" (dealType == 'Add' && topAdd == false) || dealType == 'View'"
                :show-count="true"
                placeholder="选择上级菜单"
              />
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="菜单类型" prop="leaf">
              <el-radio-group v-model.trim="form.leaf" :disabled="dealType != 'Add'">
                <el-radio :label="0">目录</el-radio>
                <el-radio :label="1">页面</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="菜单属性" prop="menuType" v-if="form.leaf == 1" >
              <el-radio-group v-model.trim="menuType" :disabled="dealType == 'View'">
                <el-radio label="0">系统操作类</el-radio>
                <el-radio label="1">业务操作类</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item  label="菜单图标">
              <el-popover
                placement="bottom-start"
                width="460"
                trigger="click"
                @show="$refs['iconSelect'].reset()"
              >
                <IconSelect ref="iconSelect" @selected="selected" />
                <el-input slot="reference" v-model.trim="form.meta.icon" placeholder="点击选择图标" >
                  <svg-icon
                    v-if="form.meta.icon"
                    slot="prefix"
                    :icon-class="form.meta.icon"
                    class="el-input__icon"
                    style="height: 32px;width: 16px;"
                  />
                  <i v-else slot="prefix" class="el-icon-search el-input__icon" />
                </el-input>
              </el-popover>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="菜单名称" prop="meta.title">
              <el-input v-model.trim="form.meta.title" placeholder="请输入菜单名称" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="显示排序" prop="orderNum">
              <el-input-number v-model.trim="form.orderNum" controls-position="right" :min="0" :max="max"/>
            </el-form-item>
          </el-col>
          <el-col :span="12" v-if="form.leaf == 1">
            <el-form-item label="是否外链" prop="outreach">
              <el-radio v-model.trim="form.outreach" label="1">是</el-radio>
              <el-radio v-model.trim="form.outreach" label="0">否</el-radio>
            </el-form-item>
          </el-col>
          <el-col :span="12" v-if="form.leaf == 1 && form.outreach == 1">
            <el-form-item label="打开方式" prop="openWay">
              <el-radio v-model.trim="form.openWay" label="0">本地</el-radio>
              <el-radio v-model.trim="form.openWay" label="1">新窗口</el-radio>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="路由地址" prop="path">
              <el-input v-model.trim="form.path" placeholder="请输入路由地址" style="width: 100%"/>
            </el-form-item>
          </el-col>
          <el-col :span="24" v-show=" form.leaf == 1 && form.outreach == 1 && form.openWay == 0">
            <el-form-item>
              <span slot="label"><span style="color:#ff4949">*</span> 外链地址</span>
              <el-input v-model.trim="form.externalLink" placeholder="请输入外链地址"  style="width: 100%" />
            </el-form-item>
          </el-col>
          <el-col :span="24" v-show=" form.leaf == 1 && form.openWay != 1">
            <el-form-item>
              <span slot="label"><span style="color:#ff4949">*</span> 组件路径</span>
              <el-input v-model.trim="form.component" placeholder="请输入组件路径"  style="width: 100%" :disabled="dealType=='Edit'"/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="菜单状态" prop="status">
              <el-radio-group v-model.trim="form.status">
                <el-radio :label="'1'">正常</el-radio>
                <el-radio :label="'0'">禁用</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer" v-show="dealType != 'View'">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
    <!-- 新的修改权限弹窗 -->
    <Edit-auth ref="EditAuth"></Edit-auth>
  </div>
</template>

<script>
import EditAuth  from "./editAuth.vue";
import { listMenu, menuDetail, delMenu, addMenu, updateMenu, listMenuOptions, maxNum } from "@/api/system/menu";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import IconSelect from "@/components/IconSelect";

export default {
  name: "Menu",
  components: { Treeselect, IconSelect, EditAuth },
  data() {
    return {
      colors: [
        { value: 'primary', label: '主要按钮', },
        { value: 'success', label: '成功按钮', },
        { value: 'info', label: '信息按钮', },
        { value: 'warning', label: '警告按钮', },
        { value: 'danger', label: '危险按钮', },
      ],
      authForm: {
        funcCode: '',
        funcName: '',
        icon: '',
        colour: ''
      },
      auth: [],
      checkList: [],
      dialogTitle:'',
      isEdit: false,
      // 添加权限对话框
      dialogAuth: false,
      // 当前选择行层级
      currentOrgLevel: 0,
      // 当前页面的code
      menuCode: '',
      // 当前弹窗的上级目录Code
      menuId: 0,
      // 遮罩层
      loading: true,
      // 显示搜索条件
      showSearch: true,
      // 菜单表格树数据
      menuList: [],
      // 菜单树选项
      menuOptions: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 显示状态数据字典
      visibleOptions: [],
      // 菜单状态数据字典
      statusOptions: [],
      // 查询参数
      queryParams: {
        menuName: undefined,
      },
      // 选中行
      currentRow: {},
      // 当前操作类型
      dealType:'',
      // 是否顶部新增
      topAdd: true,
      // 最大序号数
      max:1000,
      // 表单参数
      form: {
        menuId:'',
        meta: {
          title: '',
          icon:''
        },
        outreach: '0',
        path:"",
        leaf: 0,
        orderNum: 1,
      },
      menuType: '0',
      // 菜单权限列表
      permiList:[],
      // 表单校验
      rules: {
        menuName: [
          { required: true, message: "菜单名称不能为空", trigger: "blur" }
        ],
        orderNum: [
          { required: true, message: "菜单顺序不能为空", trigger: "blur" }
        ],
        path: [
          { required: true, message: "路由地址不能为空", trigger: "blur" }
        ],
        outreach: [
          { required: true, message: "请选择是否外链", trigger: "blur" }
        ],
        leaf: [
          { required: true, message: "菜单名称不能为空", trigger: "blur" }
        ],
        status: [
          { required: true, message: "请选择是否启用", trigger: "blur" }
        ],
        meta: {
          title: [
            { required: true, message: "菜单名称不能为空", trigger: "blur" }
          ],
        },
        openWay: [
          { required: true, message: "请选择打开方式", trigger: "blur" }
        ],
      }
    };
  },
  watch:{
    menuId(){
      this.getMaxNum();
    },
  },
  created() {
    this.getList();
    this.getPagePermis();
  },
  methods: {
    // 添加权限
    openAuth(row, type){
      this.currentRow = row
      if(type == 'Edit'){
        this.isEdit = true
      }else{
        this.dialogTitle = '添加权限'
        this.isEdit = false
      }
      this.$request({
        url:'/zy-api/api/per/find',
        method: 'post',
        data: {
          pageId: row.menuCode
        }
      }).then(res => {
        if(res.status == 200){
          this.auth = res.data
          let list = []
          this.auth.forEach(item => {
            if(item.funcCode !== 'Authorized'){
              list.push(item.funcName)
            }
          })
          this.checkList = list
          console.log(this.auth)
        }else{
          this.$message.error(`错误${res.status}：${res.errors}`)
        }
      }).finally(() => {
          this.dialogAuth = true
      })
    },
    addAuth(){
      let row = this.currentRow
      let Authlist = []
      let param = {
        pageId: row.menuCode,
        childCode: row.menuCode,
        per: Authlist
      }
      if(this.isEdit == false){
        let obj = {
          colour: this.authForm.colour,
          funcCode: this.authForm.funcCode,
          funcName: this.authForm.funcName,
          icon: this.authForm.icon,
        }
        this.auth.push(obj)
        this.auth.splice(0,1)
        param.per = this.auth
      }else{
        let list = []
        this.auth.forEach(item => {
          this.checkList.forEach(obj => {
            if(item.funcName == obj){
              list.push(item)
            }
          })
        })
        param.per = list
      }
      console.log(param)
      this.$request({
        url:'/zy-api/api/per/add',
        method: 'post',
        data: param
      }).then(res => {
        if(res.status == 200){
          this.$message({
            type: 'success',
            message: '新增成功'
          })
        }else{
          this.$message.error(`错误${res.status}：${res.errors[0].message}`)
        }
      }).finally(() => {
        this.dialogAuth = false
      })
    },
    // 选择图标
    selected(name) {
      this.form.meta.icon = name;
    },
    /** 查询菜单列表 */
    getList() {
      this.loading = true;
      // this.menuList = JSON.parse(localStorage.getItem('allMenu'));
      // setTimeout(() => {
      //   this.loading = false;
      // }, 300);

      let param = {
        parameter: {}
      }
      listMenu(param).then((res)=>{
        this.menuList = res.status==200 ? res.data : [];
        this.loading = false;
      })
    },
    /**
     * 获取当前页面的权限
     */
    getPagePermis(){
      let allMenu = JSON.parse(localStorage.getItem('allMenu'));
      let name = this.$route.name;
      this.pagePermission(name,allMenu)
    },
    pagePermission(name,allMenu){
      allMenu = Array.from( allMenu )
      allMenu.forEach((item) => {
        if( item.name == name ){
          this.permiList = item.sysFunc; 
          this.menuCode = item.menuCode;
        }else if ( item.children && item.children.length > 0 ){
          item.children = Array.from( item.children );
          this.pagePermission(name,item.children);
        }
      });
    },
    /**
     * 权限操作
     */
    handleDeal(currentRow,val){
      this.currentOrgLevel = currentRow.orgLevel
      if( val.funcCode == 'Edit' ) {
        this.handleUpdate(currentRow);
        this.currentRow = currentRow;
        this.dealType = 'Edit';
      } else if ( val.funcCode == 'Add' ){
        this.handleAdd(currentRow);
        this.dealType = 'Add';
      } else if ( val.funcCode == 'View' ){
        this.dealType = 'View';
        this.handleView(currentRow);
      } else if ( val.funcCode == 'Delete' ){
        this.handleDelete(currentRow);
        this.dealType = 'Delete';
      }
    },
    /** 转换菜单数据结构 */
    normalizer(node) {
      if (node.children && !node.children.length) {
        delete node.children;
      }
      return {
        id: node.menuId,
        label: node.menuName,
        children: node.children
      };
    },
    /** 查询菜单下拉树结构 */
    getTreeselect() {
      let param = {
        parameter: {
          // parentCode: localStorage.getItem('parentCode')
        }
      }
      listMenuOptions(param).then(res => {
        this.menuOptions = [];
        const menu = { menuId: '-1', menuName: '主类目', children: [] };
        menu.children = this.handleTree(res.data, "menuId");
        this.menuOptions.push(menu);
      });
    },
    // 显示状态字典翻译
    visibleFormat(row, column) {
      if (row.menuType == "F") {
        return "";
      }
      // return this.selectDictLabel(this.visibleOptions, row.visible);
    },
    // 菜单状态字典翻译
    statusFormat(row, column) {
      if (row.menuType == "F") {
        return "";
      }
      // return this.selectDictLabel(this.statusOptions, row.status);
    },
    // 取消按钮
    cancel() {
      this.dialogAuth = false
      this.authForm = {
        name: '',
        code: '',
        type: '',
        icon: '',
      }
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        menuCode: undefined,
        parentCode: 0,
        leaf: 0,
        path: "",
        status: "1",
        outreach: "0",
        meta:{
          title: "",
          icon: '',
        },
        orderNum: 1,
        openWay: '0',
        externalLink: undefined
      };
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      let param = {
        parameter: {
          // parentCode: localStorage.getItem('parentCode'),
          menuName: this.queryParams.menuName
        }
      }
      listMenu(param).then((res)=>{
        this.menuList = res.status==200 ? res.data : [];
      })
    },
    /** 新增按钮操作 */
    handleAdd(row) {
      this.reset();
      this.getTreeselect();
      this.dealType = 'Add';
      if (row != null && row.menuCode) {
        this.menuId = row.menuCode;
        this.topAdd = false;
      } else {

        this.menuId = localStorage.getItem('parentCode');
        this.topAdd = true;
      }
      this.getMaxNum();
      this.open = true;
      this.title = "添加菜单";
    },
    /** 查看按钮操作 */
    handleView(row) {
      this.reset();
      this.getTreeselect();
      this.menuId = row.parentCode;
      let param = {
        parentCode: localStorage.getItem('parentCode'),
        childCode: row.menuCode
      }
      menuDetail(param).then(res => {
        this.form = res.data;
        this.form.menuId = row.parentCode;
        this.menuType = res.data.menuType;
        this.open = true;
        this.title = "查看菜单"
      });
    },
    /** 获取序号 */
    getMaxNum(){
      let param = {
        parameter: {
          parentCode: this.menuId
        },
        parentCode: localStorage.getItem('parentCode'),
        childCode:this.menuCode
      }
      maxNum(param).then(res=>{
        if( res.status == 200 ){
          this.max = parseInt(res.data.maxOrderNum);
          if( this.dealType == 'Add' ){
            this.form.orderNum = this.max;
          }
        }
      })
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      this.getTreeselect();
      this.menuId = row.parentCode;
      let param = {
        parentCode: localStorage.getItem('parentCode'),
        childCode: row.menuCode
      }
      menuDetail(param).then(res => {
        this.form = res.data;
        this.form.menuId = row.parentCode;
        this.menuType = res.data.menuType;
        this.open = true;
        this.title = "编辑菜单"
      });
    },
    /** 提交按钮 */ 
    submitForm: function() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.dealType == 'Edit') {
            if( this.currentRow.children && this.currentRow.children.length > 0 && this.form.leaf == 1 ){
              this.msgError('当前节点不能修改为页面');
              return;
            }
            
            let param = {
              parameter: {
                sysMenu: {  // 菜单目录
                  menuName: this.form.meta.title,  // 菜单标题
                  parentCode: this.menuId,  // 上级目录ID
                  pageId: this.form.menuCode,  // 修改目录的ID
                  menuIco: this.form.meta.icon,  // 图标
                  orderNum: this.form.orderNum,  // 排序
                  leafFlag: this.form.leaf.toString(),  // 菜单类型
                  menuType: this.menuType,
                  menuCode: this.form.menuCode,  // 修改目录的ID
                  status: this.form.status,  // 菜单状态
                  editTime: this.form.editTime,  // 编辑时间
                  outreach: this.form.outreach,  // 是否外链
                  openWay: this.form.openWay, // 外链地址
                },
                sysPage: {  // 菜单页面
                  pageUrl: this.form.path,  // 页面路由
                  pageId: this.form.menuCode,  // 页面ID
                  component: this.form.component,  // 页面的组件路径
                  status: this.form.status,  // 页面状态
                  note: '',  // 备注，但是没有用
                  pageName: this.form.meta.title,  // 页面标题
                  orderNum: this.form.orderNum,  // 排序
                  externalLink: this.form.externalLink, // 外链地址
                }
              },
              parentCode: localStorage.getItem('parentCode'), // 顶级菜单的ID
              childCode:this.menuCode //  当前页面的ID
            }
            updateMenu(param).then(res => {
              if( res.status == 200 ){
                this.msgSuccess("修改成功");
                this.open = false;
                this.getList();
              } else if( res.status == 101 ){
                this.msgError(res.errors[0].message);
              }
            });
          } else if(this.dealType == 'Add') {
            if(this.menuId == -1){
              this.msgWarning('请选择正确的上级目录');
              return;
            }
            let secondMenu = ''
            if(this.form.leaf == 0 && this.currentOrgLevel != 1){
              secondMenu = '1'
            }else{
              secondMenu = '0'
            }
            let param = {
              parameter: {
                sysMenu: {  // 菜单目录
                  menuName: this.form.meta.title,  // 菜单标题
                  parentCode: this.menuId,  // 上级目录ID
                  pageId: this.form.pageId ? this.form.pageId : null,  // 不知道啥用
                  menuIco: this.form.meta.icon,  // 图标
                  orderNum: this.form.orderNum,  // 排序
                  leafFlag: this.form.leaf.toString(),  // 菜单类型
                  menuType: this.menuType,  // 菜单属性，如果是页面，这个参数不传
                  outreach: this.form.outreach,  // 菜单状态
                  secondMenu: secondMenu,  // 是否是二级菜单目录
                  openWay: this.form.openWay, // 外链地址
                },
                sysPage: {  // 菜单页面
                  pageUrl: this.form.path,  // 页面路由
                  component: this.form.component,  // 页面的组件路径
                  status: this.form.status,  // 页面状态
                  note: '',  // 备注，但是没有用
                  pageName: this.form.meta.title,  // 页面标题
                  externalLink: this.form.externalLink, // 外链地址
                }
              },
              parentCode: localStorage.getItem('parentCode'), // 顶级菜单的ID
              childCode:this.menuCode, //  当前页面的ID
            }
            if (this.form.leaf == 0){
              delete param.parameter.sysMenu.menuType
            }
            addMenu(param).then(response => {
              if( response.status == '200' ){
                this.msgSuccess("新增成功");
                this.open = false;
                this.getList();
              } else if( response.status == 101 ){
                this.msgError(response.errors[0].message);
              }
            });
          } else if(this.dealType == 'View'){
            this.open = false;
          } 
        }
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      if( row.leaf == 0 && row.children.length>0){
        this.$confirm('此目录存在子菜单，无法删除?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
        return;
      }
      this.$confirm('是否确认删除名称为"' + row.meta.title + '"的数据项?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          let param = {
            parameter: {
              menuCode: row.menuCode,
              editTime: row.editTime
            },
            parentCode: localStorage.getItem('parentCode'),
            childCode: this.menuCode
          }
          return delMenu(param);
        }).then((res) => {
          if(res.status == 200){
            this.getList();
            this.msgSuccess("删除成功");
          }else if(res.status == 101){
            this.msgError(res.errors[0].message);
            this.open = false;
          }
        })
    },
    // 打开修改权限弹窗
    openEditAuthDialog(row){
      this.$refs.EditAuth.open(row)
    }
  }
};
</script>
<style lang="scss" scoped>
.head-form{
  display: flex;
  justify-content: space-between;
}
.el-checkbox{
  margin-top: 20px;
  margin-right: 20px;
  .el-checkbox__label{
    padding-left: 6px !important;
  }
}
.el-form{
  .el-form-item{
    .el-input, .el-select{
      width: 220px;
    }
  }
}
.checkbox-span{
  display: inline-block;
}
</style>